<!DOCTYPE html>
<html>
  <head>
     <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>播放器</title>
	<link href="static/bootstrap/5.2.3/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="static/xgplayer/3.0.10/xgplayer.min.css">
	
    <style type="text/css">
	 a {
			font-size:20px;
		}
		.col-sm-12 a {
			white-space: nowrap;/*规定段落的文本不进行换行*/
			 overflow: hidden;/*超出隐藏*/
			 text-overflow: ellipsis;/*隐藏的字符用省略号表示  IE*/
			-moz-text-overflow: ellipsis;/*隐藏的字符用省略号表示  火狐*/
		}
		 .table tr td {
			vertical-align: middle;/*画像居中*/
			white-space: nowrap;/*规定段落的文本不进行换行*/
			overflow: hidden;/*超出隐藏*/
			text-overflow: ellipsis;/*隐藏的字符用省略号表示  IE*/
			-moz-text-overflow: ellipsis;/*隐藏的字符用省略号表示  火狐*/
		}
		
		.truncate {
		   /* width: 500px; 定义超链接的宽度 */
		  white-space: nowrap; /* 确保文本不会换行 */
		  overflow: hidden; /* 隐藏超出容器宽度的文本 */
		  text-overflow: ellipsis; /* 超出部分用省略号表示 */
		  display: block; /* 使超链接表现得像块级元素 */
		}
		
		.btn-group-xs>.btn, .btn-xs {
			padding: 1px 5px;
			font-size: 12px;
			line-height: 1.5;
			border-radius: 3px;
		}
		
			
	  li {
		display: inline;
		white-space: nowrap;
	  }
    </style>
    <script type="text/javascript">
    </script>
  </head>
  <body>
   
	
	<div class="container">
		<div class="row">
			<div class="col-sm-12">
					
    <div id="mse"></div>
					   <!--
					   <video id="videoId" class="video-js"   height="400"  controls preload="auto" autoPlay="true" 
					   x5-playsinline="true"
						 playsinline="true"
						 webkit-playsinline="true"
						 x-webkit-airplay="true"
						 x5-video-orientation="portraint"
					   >
					   
							<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
						</video>
						-->
								
			</div>
		</div>
		<div class="row">
			<div class="col-sm-12" style="height: 600px;overflow-y: scroll;">
			<!--
				<table  id="div1" class="nav nav-list" style="width: 200px;">
				</table>
				-->
				<ul  id="div1" class="nav nav-list">
				</ul>
			</div>
		</div>
	</div>
	
      <script src="static/jquery-3.7.1.min.js"></script> 
	  
	  
    <script src="static/xgplayer/3.0.10/xgplayer.min.js" charset="utf-8"></script>
    <script src="static/xgplayer/3.0.10/xgplayer-mp4.min.js" charset="utf-8"></script>
    <script src="static/xgplayer/3.0.10/xgplayer-hls-3.0.10.min.js" charset="utf-8"></script>
    <script src="static/xgplayer/3.0.10/xgplayer-flv.js.3.0.0-alpha.1.min.js" charset="utf-8"></script>
    <script src="static/bootstrap/5.2.3/bootstrap.bundle.min.js"></script>
    <script type="text/javascript">
	  var globalList=[]
	  var domain = window.location.host;
		  var port = location.port; 
		  var winUrl = window.location.href
		  winUrl="http://"+domain
		  
		 function getParams(url) {
			  const search = url.split('?')[1];
			  if (!search) return {};
			  const paramArr = search.split('&');
			  const paramObj = {};
			  for (const param of paramArr) {
				const [key, value] = param.split('=');
				paramObj[key] = value;
			  }
			  return paramObj;
		}
			
			function newXgPlayer(vurl){
				return	new window.Player({
				  id: 'mse',
				  isLive: false,
				  playsinline: true,
				   autoplay: true,
				  url: vurl,
				  autoplay: true,
				  height: 400,
				  width: window.innerWidth-600,//window.innerWidth,
				  plugins: [window.Mp4Plugin,window.FlvJsPlugin,
				  window.HlsPlayer],	  
				  mp4plugin: {
					maxBufferLength: 50,
					minBufferLength: 10,
				  },
				  controls: {
					autoHide: true
				  }
			  });
			}
			
	var url="http://192.168.3.84:8888/aa.flv"
	//url='http://192.168.3.84:8888/cc.rmvb'
	//url='http://192.168.3.84:8888/aa/01.mp4'
	url='http://192.168.3.84:8888/ucvideo/VideoData/17179520281144169.m3u8'
	
	
	let params=getParams(window.location.href)
	if(params&&params['vurl']){
		url=params['vurl']
	}
	console.log('url=',url)
	window.sksxgPlayer = newXgPlayer(url)
			 
			 
    </script>
  </body>
</html>
